<template>
<div class="layerRtb layerRtb-threecolumn">
    <three-title :title="{name:'订单'}"></three-title>
    <div class="pr10 thinScroll" v-scrollHeight="85">
      <div>
        <div class="analyItem">
          <p class="analyItemTit tx-center">人工</p>
          <div class="analyItemCon">
            <p class="col-md-2">
              <span class="pr8 cLightGray">工种</span>
              <span class="cGreen">0</span>
            </p>
            <p class="col-md-3">
              <span class="pr8 cLightGray">天数</span>
              <span class="cGreen">0天</span>
            </p>
            <p class="col-md-4">
              <span class="pr8 cLightGray">总成本</span>
              <span class="cGreen">0元</span>
            </p>
            <p class="col-md-6">
              <span class="cLightGray">总报价</span>
              <span class="cGreen">0</span>
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
          </div>
        </div>
        <div class="analyItem">
          <p class="analyItemTit tx-center">材料</p>
          <div class="analyItemCon">
            <p class="fl col-md-4">
              <span class="cLightGray pr8">店铺</span>
              <span>0</span>
            </p>
            <p class="fl col-md-4">
              <span class="cLightGray pr8">金额</span>
              <span>0</span>
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
          </div>
        </div>
        <div class="analyItem">
          <p class="analyItemTit tx-center">质量</p>
          <div class="analyItemCon">
            <p class="col-md-3">
              <span class="cLightGray pr8">总计</span>0个
            </p>
            <p class="col-md-3">
              <span class="cLightGray pr8">已完成</span>
0
            </p>
            <p class="col-md-3">
              <span class="cLightGray pr8">占比</span>
              0
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
            <!-- <p class="fl" v-if="qualityNumber/orderWorkerCraftList.length*100 < 80">
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
            <p
              class="fl"
              v-else-if="qualityNumber/orderWorkerCraftList.length*100 >=80  &&qualityNumber/orderWorkerCraftList.length*100 < 100"
            >
              <span class="circlemark circlemark-lightGreen">良</span>
            </p>
            <p class="fl" v-else-if="qualityNumber/orderWorkerCraftList.length*100 == 100">
              <span class="circlemark circlemark-green">优</span>
            </p>-->
          </div>
        </div>
        <div
          class="analyItem">
          <p class="analyItemTit tx-center">现场</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">订单共</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">已处理</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">占比</span>
              0
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
          </div>
        </div>
        <div class="analyItem">
          <p class="analyItemTit tx-center">款项</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">合同额</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">应收</span>
              <span
                class="cGreen"
              >0</span>
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">已收</span>
              <span
                class="cGreen"
              >0万</span>
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
            <!-- <p class="fl" v-if="((basicData!=undefined ? basicData.Received/10000 : 0)/basicData.Receivable)*100 < 80">
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
            <p
              class="fl"
              v-else-if="((basicData!=undefined ? basicData.Received/10000 : 0)/basicData.Receivable)*100 && (basicData.Received/basicData.Receivable)*100 < 100"
            >
              <span class="circlemark circlemark-lightGreen">良</span>
            </p>
            <p class="fl" v-else>
              <span class="circlemark circlemark-green">优</span>
            </p>-->
          </div>
        </div>
        <div
          class="analyItem">
          <p class="analyItemTit tx-center">摄像头</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">订单共</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">已处理</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">占比</span>
              0
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
          </div>
        </div>

                <div
          class="analyItem">
          <p class="analyItemTit tx-center">资料</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">应传</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">已传</span>
              0
            </p>
            <p class="col-md-4">
              <span class="cLightGray pr8">占比</span>
              0
            </p>
            <p class="fl" >
              <span class="circlemark circlemark-lightRed">差</span>
            </p>
          </div>
        </div>
      </div>
      <!-- <div v-if="afterMarketState == '准备'">
        <router-link
          tag="div"
          v-for="(item ,index) in OrderData"
          :key="index"
          exact
          :to="{path:routerPath('threeReadyOrder'), query:{project:item.code}}"
          class="analyItem anItemBor hide"
          active-class="anItemBor-active"
        >
          <p class="analyItemTit tx-center">{{item.typeName}}</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">订单日期</span>
              {{item.orderTime.substring(0,10)}}
            </p>
            <p class="col-md-4" v-if="item.statusName === '完成'">
              <span class="pr5 cGreen">已完成</span>
            </p>
            <p class="col-md-4" v-else>
              <span class="cLightGray pr8">当前阶段</span>
              <span class="pr5 cred">{{item.statusName}}</span>
            </p>
            <span href="javascript:" class="circlemark circlemark-green" v-if="item.status === 0">完</span>
            <span class="circlemark circlemark-purple" v-else>待</span>
          </div>
        </router-link>
        <router-link
          tag="div"
          exact
          :to="{path:routerPath('objection'), query:{}}"
          class="analyItem anItemBor hide"
          active-class="anItemBor-active"
        >
          <p class="analyItemTit tx-center">异议</p>
          <div class="analyItemCon">
            <p class="col-md-4">
              <span class="cLightGray pr8">审核补发</span>
              <span class="contractTwoNum">-</span>元
            </p>
            <p class="col-md-4" v-if="dates!==''">
              <span class="cLightGray pr8">提交时间</span>
              <span>{{dates}}</span>
            </p>
          </div>
        </router-link>
      </div>-->
      <router-link
        tag="div"
        v-for="(item ,index) in mentOrder"
        :key="index"
        exact
        :to="{path:routerPath('threeReadyOrder'), query:{project:item.code}}"
        class="analyItem anItemBor hide"
        active-class="anItemBor-active"
      >
        <p class="analyItemTit tx-center">{{item.typeName}}</p>
        <div class="analyItemCon">
          <p class="col-md-4">
            <span class="cLightGray pr8">订单日期</span>
            {{item.orderTime.substring(0,10)}}
          </p>
          <p class="col-md-4" v-if="item.statusName === '完成'">
            <span class="pr5 cGreen">已完成</span>
          </p>
          <p class="col-md-4" v-else>
            <span class="cLightGray pr8">当前阶段</span>
            <span class="pr5 cred">{{item.statusName}}</span>
          </p>
          <span href="javascript:" class="circlemark circlemark-green" v-if="item.status === 0">完</span>
          <span class="circlemark circlemark-purple" v-else>待</span>
        </div>
      </router-link>
    </div>
    <div class="layerRtb-footer">
        <div class="analyItem">
            <p class="analyItemTit tx-center">综合</p>
            <div class="analyItemCon">
               <p class="col-md-4">
                        <span class="cLightGray pr8">应做</span>
                        <span>{{rest[0].oughtOrder}}</span>
                    </p>
                    <p class="col-md-4">
                        <span class="cLightGray pr8">已做</span>
                        <span class="c666">{{rest[0].overOrder}}</span>
                    </p>
                    <p class="col-md-4">
                        <span class="cLightGray pr8">差额</span>
                        <span class="c666">{{rest[0].oughtOrder-rest[0].overOrder}}</span>
                    </p>
            </div>
        </div>
        <!-- <div class="tx-center">
            <input type="button" class="uiBtn-normal uiBtn-blue" value="确定">
        </div> -->
    </div>
</div>
</template>
<script>
import { GetOrderInfoByProject, GetByuidProjectManagerProcess } from '../../Resources/Api'
import {
    mapGetters
} from 'vuex'
export default {
    data () {
        return {
            orderList: [],
            rest: []
        }
    },
    created () {
        this.GetOrderInfo()
        this.getProjectManagerProcess()
    },
    methods: {
        GetOrderInfo () {
            let _this = this
            _this.orderList = []
            GetOrderInfoByProject({
                orderNo: _this.$route.query.orderNo
            }).then(results => {
                _this.orderList = results.data.Body
            }).catch(error => {
                console.log(error)
            })
        },
        getProjectManagerProcess () {
            let _this = this
            _this.rest = []
            GetByuidProjectManagerProcess({
                uid: _this.leftInfo.uid,
                orderNo: _this.$route.query.orderNo
            }).then(results => {
                _this.rest = results.data.Body
            }).catch(error => {
                console.log(error)
            })
        }
    },
    computed: {
        ...mapGetters(['leftInfo'])
    },
    watch: {
        $route () {
            this.GetOrderInfo()
            this.getProjectManagerProcess()
        },
        leftInfo () {
            this.getProjectManagerProcess()
        }
    }
}
</script>
